<template>
    <div class="gray">
        <search></search>
        <p>意见与反馈</p>
        <van-field
            v-model="message"
            rows="2"
            label="留言"
            type="textarea"
            maxlength="150"
            placeholder="请填写你的意见和反馈"
            :autosize="{ maxHeight: 100, minHeight: 72 }"
            show-word-limit
            />
        <div class="contact">
            <p>联系方式:</p>
            <input type="text" placeholder="邮箱/手机号/微信号" size="large" v-model="phone ">
        </div>
        <button @click="Submit">提交</button>
    </div>
</template>

<script>
import { Toast } from 'vant';
import search from "@/components/search"
import { submitAction } from '@/api/home/index';
export default {
    data() {
        return {
            message:"",
            phone :""
        };
    },
    methods: {
        Submit(){
            var names = JSON.parse(localStorage.getItem("userInfo"))
            // console.log(names.nickName);
            submitAction({
                content:this.message,
                name:names,
                openId:localStorage.getItem("openId"),
                phone:this.phone
            }).then(res=>{
                Toast.success('提交成功');
            })
        }
    },
    created() {

    },
    computed: {

    },
    mounted() {

    },
    components:{
        search
    }
};
</script>

<style scoped lang="scss">
    .gray{
        padding: 0 10px;
        p{
            margin: 0;
            padding: 10px 0;
            text-align: left;
            border-bottom: 1Px solid #d9d9d9;
        }
        ::v-deep .van-cell{
            // height: 113px;
            border-bottom: 1Px solid #d9d9d9;
        }
    }
    input::-webkit-input-placeholder {
        color: #ccc;
         font-size: 14px;
      }
      input::-moz-input-placeholder {
        color: #ccc;
         font-size: 14px;
      }
      input::-ms-input-placeholder {
        color: #ccc;
         font-size: 14px;
      }
      .contact{
         display: flex;
         padding: 10px 16px;
         height: 23px;
         border-bottom: 1Px solid #d9d9d9;
         p{
             width: 85px;
             margin-right:12px;
             border: 0;
             padding: 0;
            line-height: 23px;
            font-size: 14px;
         }
         input{
             border: 0;
         }
      }
      button{
          text-align: center;
            width: 95%;
            height: 1.33333rem;
            border-radius: .13333rem;
            line-height: 1.33333rem;
            background: #b4282d;
            color: #fff;
            font-size: .42667rem;
            margin: 1.33333rem auto 0 auto;
            border: 0;
      }
</style>
